var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
    return new (P || (P = Promise))(function (resolve, reject) {
        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
        step((generator = generator.apply(thisArg, _arguments || [])).next());
    });
};
(function (factory) {
    if (typeof module === "object" && typeof module.exports === "object") {
        var v = factory(require, exports);
        if (v !== undefined) module.exports = v;
    }
    else if (typeof define === "function" && define.amd) {
        define(["require", "exports", "js-xlsx", "react", "react-dom", "services/shopping", "services/account", "maishu-wuzhui", "maishu-dilu", "maishu-ui-toolkit", "maishu-chitu-service", "services/dataSources", "maishu-wuzhui-helper"], factory);
    }
})(function (require, exports) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    // import { } from 'js-xlsx'
    require("js-xlsx");
    const React = require("react");
    const ReactDOM = require("react-dom");
    const shopping_1 = require("services/shopping");
    const account_1 = require("services/account");
    const wuzhui = require("maishu-wuzhui");
    const maishu_dilu_1 = require("maishu-dilu");
    const ui = require("maishu-ui-toolkit");
    const maishu_chitu_service_1 = require("maishu-chitu-service");
    const dataSources_1 = require("services/dataSources");
    const maishu_wuzhui_helper_1 = require("maishu-wuzhui-helper");
    function default_1(page) {
        let shopping = page.createService(shopping_1.ShoppingService);
        let account = page.createService(account_1.AccountService);
        var dataSource = new wuzhui.DataSource({
            select: (args) => shopping.orders(args)
        });
        /**
         * 订单发货窗口
         */
        class OrderSendDialog extends React.Component {
            constructor(props) {
                super(props);
                this.state = { order: null };
            }
            show(order, shipInfo) {
                // this.state.shipInfo = shipInfo || {} as any;
                // this.state.order = order;
                // this.setState(this.state);
                this.setState({
                    shipInfo: shipInfo || {},
                    order: order
                });
                ui.showDialog(this.element);
            }
            hide() {
                ui.hideDialog(this.element);
            }
            componentDidMount() {
                let { required } = maishu_dilu_1.rules;
                this.validator = new maishu_dilu_1.FormValidator(page.element, { name: "expressBillNo", rules: [required("请输入快递单号")] }, { name: "expressCompany", rules: [required("请输入快递公民名称")] });
            }
            save() {
                return __awaiter(this, void 0, void 0, function* () {
                    let isValid = yield this.validator.check();
                    if (!isValid) {
                        return Promise.reject('validate fail');
                    }
                    let shop = page.createService(shopping_1.ShoppingService);
                    let { order, shipInfo } = this.state;
                    let result = yield shop.deliverOrder(order, shipInfo);
                    dataSource.updated.fire(dataSource, order);
                    this.hide();
                    return result;
                });
            }
            render() {
                let { order, shipInfo } = this.state;
                if (order == null) {
                    return null;
                }
                let orderStatus = order ? order.Status : null;
                return [
                    React.createElement("div", { key: 10, className: "modal fade", ref: (e) => this.element = e || this.element },
                        React.createElement("div", { className: "modal-dialog" },
                            React.createElement("div", { className: "modal-content" },
                                React.createElement("div", { className: "modal-header" },
                                    React.createElement("button", { type: "button", className: "close", "data-dismiss": "modal" },
                                        React.createElement("span", { "aria-hidden": "true" }, "\u00D7"),
                                        React.createElement("span", { className: "sr-only" }, "Close")),
                                    React.createElement("h4", { className: "modal-title" }, "\u53D1\u8D27\u4FE1\u606F")),
                                React.createElement("div", { className: "modal-body form-horizontal" },
                                    React.createElement("input", { name: "orderId", type: "hidden" }),
                                    React.createElement("div", { className: "form-group" },
                                        React.createElement("label", { className: "col-sm-2 control-label" }, "\u8BA2\u5355\u65F6\u95F4"),
                                        React.createElement("div", { className: "col-sm-10" },
                                            React.createElement("input", { name: "createDateTime", type: "text", className: "form-control", readOnly: true, value: order.OrderDate.toLocaleString() || '' }))),
                                    React.createElement("div", { className: "form-group" },
                                        React.createElement("label", { className: "col-sm-2 control-label" }, "\u4ED8\u6B3E\u4EBA"),
                                        React.createElement("div", { className: "col-sm-10" },
                                            React.createElement("input", { name: "consignee", type: "text", className: "form-control", readOnly: true, value: order.MemberName || "" }))),
                                    React.createElement("div", { className: "form-group" },
                                        React.createElement("label", { className: "col-sm-2 control-label" }, "\u6536\u8D27\u5730\u5740"),
                                        React.createElement("div", { className: "col-sm-10" },
                                            React.createElement("input", { name: "receiptAddress", type: "text", className: "form-control", readOnly: true, value: order.ReceiptAddress || "" }))),
                                    React.createElement("div", { className: "form-group" },
                                        React.createElement("label", { className: "col-sm-2 control-label" }, "\u5FEB\u9012\u5355\u53F7"),
                                        React.createElement("div", { className: "col-sm-10" },
                                            React.createElement("input", { name: "expressBillNo", type: "text", className: "form-control", value: shipInfo.ExpressBillNo || "", readOnly: orderStatus == "Send", ref: (e) => this.expressBillNoInput = e || this.expressBillNoInput, onChange: (e) => {
                                                    shipInfo.ExpressBillNo = e.target.value;
                                                    this.setState(this.state);
                                                } }))),
                                    React.createElement("div", { className: "form-group" },
                                        React.createElement("label", { className: "col-sm-2 control-label" }, "\u5FEB\u9012\u516C\u53F8"),
                                        React.createElement("div", { className: "col-sm-10" },
                                            React.createElement("input", { name: "expressCompany", type: "text", className: "form-control", value: shipInfo.ExpressCompany || "", readOnly: orderStatus == "Send", ref: (e) => this.expressCompanyInput = e || this.expressCompanyInput, onChange: (e) => {
                                                    shipInfo.ExpressCompany = e.target.value;
                                                    this.setState(this.state);
                                                } })))),
                                React.createElement("div", { className: "modal-footer" },
                                    React.createElement("button", { type: "button", className: "btn btn-default", "data-dismiss": "modal" }, "\u53D6\u6D88"),
                                    React.createElement("button", { type: "submit", className: "btn btn-primary", disabled: orderStatus == "Send", ref: (e) => {
                                            if (!e)
                                                return;
                                            ui.buttonOnClick(e, () => {
                                                return this.save();
                                            }, { toast: '保存成功' });
                                        } }, "\u4FDD\u5B58"))))),
                ];
            }
        }
        class OrderDetailDialog extends React.Component {
            constructor(props) {
                super(props);
                this.state = { order: OrderDetailDialog.defaultOrder, isEdit: false };
                dataSource.updated.add((sender, order) => {
                    // this.state.order = order;
                    // this.setState(this.state);
                    this.setState({ order });
                });
            }
            show(order) {
                return __awaiter(this, void 0, void 0, function* () {
                    // this.state.order = order;
                    // this.setState(this.state);
                    this.setState({ order });
                    ui.showDialog(this.element);
                });
            }
            hide() {
                ui.hideDialog(this.element);
            }
            showReceiveDialog() {
                // this.dialog.state.order = this.state.order;
                // this.dialog.setState(this.dialog.state);
                this.dialog.setState({ order: this.state.order });
                this.dialog.show();
            }
            modify() {
                // this.state.isEdit = true;
                // this.setState(this.state);
                this.setState({ isEdit: true });
            }
            cancelEdit() {
                // this.state.isEdit = false;
                // this.setState(this.state);
                this.setState({ isEdit: false });
            }
            bindInputField(obj, field, style) {
                let valueText;
                valueText = obj[field];
                if (this.state.isEdit == false) {
                    return React.createElement("span", null, valueText);
                }
                if (style)
                    style.border = 'solid 1px #ccc';
                return React.createElement("input", { name: field, style: style, ref: (e) => e ? e.value = `${valueText}` : null });
            }
            save() {
                return __awaiter(this, void 0, void 0, function* () {
                    let { order } = this.state;
                    order = JSON.parse(JSON.stringify(order));
                    order.OrderDate = new Date(Date.parse(order.OrderDate));
                    order.Freight = Number.parseFloat(this.element.querySelector('[name="Freight"]').value);
                    for (let i = 0; i < order.OrderDetails.length; i++) {
                        let row = this.element.querySelector(`[id='${order.OrderDetails[i].Id}']`);
                        let priceText = row.querySelector('[name="Price"]').value;
                        let quantityText = row.querySelector('[name="Quantity"]').value;
                        order.OrderDetails[i].Price = Number.parseFloat(priceText);
                        order.OrderDetails[i].Quantity = Number.parseInt(quantityText);
                    }
                    let o = yield shopping.updateOrder(order);
                    Object.assign(this.state.order, o);
                    dataSource.updated.fire(dataSource, this.state.order);
                    // this.state.isEdit = false;
                    // this.setState(this.state);
                    this.setState({ isEdit: false });
                });
            }
            render() {
                let order = this.state.order;
                let isEdit = this.state.isEdit;
                return [
                    React.createElement("div", { key: 10, className: "modal fade", style: { display: 'none' }, ref: (e) => this.element = e || this.element },
                        React.createElement("div", { className: "modal-dialog" },
                            React.createElement("div", { className: "modal-content" },
                                React.createElement("div", { className: "modal-header" },
                                    React.createElement("button", { type: "button", className: "close", "data-dismiss": "modal" },
                                        React.createElement("span", { "aria-hidden": "true" }, "\u00D7"),
                                        React.createElement("span", { className: "sr-only" }, "Close")),
                                    React.createElement("h4", { className: "modal-title" }, "\u8BA2\u5355\u4FE1\u606F")),
                                React.createElement("div", { className: "modal-body" },
                                    React.createElement("table", { className: "table table-striped table-bordered", style: { textAlign: 'left' } },
                                        React.createElement("tbody", null,
                                            React.createElement("tr", null,
                                                React.createElement("td", { className: "fieldHeader", style: { width: 80 } }, "\u8BA2\u5355\u65E5\u671F"),
                                                React.createElement("td", { style: { width: 180 }, "data-bind": "text: OrderDate" }, order.OrderDate.toLocaleDateString()),
                                                React.createElement("td", { style: { width: 80 } }, "\u4ED8\u6B3E\u4EBA"),
                                                React.createElement("td", null, order.MemberName)),
                                            React.createElement("tr", null,
                                                React.createElement("td", null, "\u53D1\u7968\u4FE1\u606F"),
                                                React.createElement("td", { colSpan: 3 }, order.Invoice)),
                                            React.createElement("tr", null,
                                                React.createElement("td", null, "\u5907\u6CE8\u4FE1\u606F"),
                                                React.createElement("td", { colSpan: 3 }, order.Remark)),
                                            React.createElement("tr", null,
                                                React.createElement("td", null, "\u6536\u8D27\u5730\u5740"),
                                                React.createElement("td", { colSpan: 3 }, order.ReceiptAddress)))),
                                    React.createElement("table", { className: "table table-striped table-bordered table-hover" },
                                        React.createElement("thead", null,
                                            React.createElement("tr", null,
                                                React.createElement("th", null, "\u540D\u79F0"),
                                                React.createElement("th", null, "\u4EF7\u683C"),
                                                React.createElement("th", { style: { width: 60 } }, "\u6570\u91CF"))),
                                        React.createElement("tbody", null, order.OrderDetails.filter(o => o != null).map(orderDetail => React.createElement("tr", { key: orderDetail.Id, id: orderDetail.Id },
                                            React.createElement("td", { "data-bind": "text: ProductName" }, orderDetail.ProductName),
                                            React.createElement("td", { style: { textAlign: 'right' } },
                                                "\u00A5 ",
                                                this.bindInputField(orderDetail, 'Price', { width: `40px`, textAlign: 'right' })),
                                            React.createElement("td", { style: { textAlign: 'right' } }, this.bindInputField(orderDetail, 'Quantity', { width: `40px`, textAlign: 'right' }))))),
                                        React.createElement("tfoot", null,
                                            React.createElement("tr", null,
                                                React.createElement("td", { colSpan: 3, style: { textAlign: 'right', fontWeight: 'bold' } },
                                                    React.createElement("div", { style: { float: 'left' } },
                                                        "\u90AE\u8D39\uFF1A\u00A5",
                                                        this.bindInputField(order, 'Freight', { width: 40 })),
                                                    React.createElement("div", { style: { float: 'right' } }, `小计：¥${order.Amount.toFixed(2)}`),
                                                    React.createElement("div", { className: "clearfix" }),
                                                    React.createElement("div", { style: { textAlign: 'right' } }, `合计：¥${order.Sum.toFixed(2)}`)))))),
                                React.createElement("div", { className: "modal-footer" }, order.Status == 'WaitingForPayment' ? [
                                    isEdit ? React.createElement("button", { key: "btn-cancel", className: "btn btn-default", onClick: () => this.cancelEdit() }, "\u53D6\u6D88") : null,
                                    isEdit ?
                                        React.createElement("button", { key: "btn-save", className: "btn btn-primary", ref: (e) => {
                                                if (!e)
                                                    return;
                                                ui.buttonOnClick(e, () => {
                                                    return this.save();
                                                });
                                            } }, "\u4FDD\u5B58\u8BA2\u5355") : null,
                                    !isEdit ? React.createElement("button", { key: "btn-modify", type: "button", className: "btn btn-primary", onClick: () => this.modify() }, "\u4FEE\u6539\u8BA2\u5355") : null,
                                    React.createElement("button", { key: "btn-receive", type: "button", className: "btn btn-primary", onClick: () => this.showReceiveDialog() }, "\u786E\u8BA4\u6536\u6B3E")
                                ] : null)))),
                    order ? React.createElement(ReceivablesDialog, { key: 20, ref: (e) => this.dialog = e }) : null
                ];
            }
        }
        OrderDetailDialog.defaultOrder = {
            OrderDate: new Date(),
            Consignee: '',
            ReceiptAddress: '',
            Invoice: '',
            Remark: '',
            OrderDetails: [],
            Freight: 0,
            Amount: 0,
            Sum: 0
        };
        /**
         * 订单收款窗口
         */
        class ReceivablesDialog extends React.Component {
            constructor(props) {
                super(props);
                this.state = { order: null, paymentType: 'WeiXin', accounts: [] };
            }
            receive() {
                return __awaiter(this, void 0, void 0, function* () {
                    let isValid = yield this.validator.check();
                    if (!isValid) {
                        return Promise.reject('validate fail');
                    }
                    let order = this.state.order;
                    console.assert(order != null);
                    let amount = Number.parseFloat(this.actualPayElement.value);
                    let paymentType = this.state.paymentType;
                    let receivement = {
                        Id: this.receivementId,
                        Amount: amount,
                        AccountId: this.accountElement.value
                    };
                    let result = yield account.createReceivement(order.Id, amount, this.accountElement.value); //order.CustomerId, , amount
                    order.Status = 'Paid';
                    dataSource.updated.fire(dataSource, order);
                    // .then(() => {
                    //     if (this.props.paid)
                    //         this.props.paid(order);
                    this.hide();
                    // });
                    return result;
                });
            }
            show() {
                return __awaiter(this, void 0, void 0, function* () {
                    this.receivementId = maishu_chitu_service_1.guid();
                    this.validator.clearErrors();
                    let result = yield dataSources_1.dataSources.account.select();
                    let accounts = Array.isArray(result) ? account : result.dataItems;
                    this.setState({ accounts });
                    ui.showDialog(this.element);
                });
            }
            hide() {
                ui.hideDialog(this.element);
            }
            componentDidMount() {
                this.validator = new maishu_dilu_1.FormValidator(this.element, { name: 'accountId', rules: [maishu_dilu_1.rules.required('请选择账户')] });
            }
            render() {
                let order = this.state.order || { Sum: 0 };
                let { paymentType, accounts } = this.state;
                return (React.createElement("div", { className: "modal fade", ref: (e) => this.element = e || this.element },
                    React.createElement("div", { className: "modal-dialog" },
                        React.createElement("div", { className: "modal-content" },
                            React.createElement("div", { className: "modal-header" },
                                React.createElement("button", { type: "button", className: "close", "data-dismiss": "modal" },
                                    React.createElement("span", { "aria-hidden": "true" }, "\u00D7"),
                                    React.createElement("span", { className: "sr-only" }, "Close")),
                                React.createElement("h4", { className: "modal-title" }, "\u8BA2\u5355\u6536\u6B3E")),
                            React.createElement("form", { className: "modal-body" },
                                React.createElement("div", { className: "form-group row" },
                                    React.createElement("div", { className: "col-xs-2" }, "\u5E94\u6536\u6B3E"),
                                    React.createElement("div", { className: "col-xs-10" },
                                        React.createElement("div", { className: "input-group" },
                                            React.createElement("div", { className: "input-group-addon" }, "\u00A5"),
                                            React.createElement("input", { name: "shouldPay", type: "text", className: "form-control", value: order.Sum, readOnly: true, ref: (e) => this.shouldPayElement = e || this.shouldPayElement })))),
                                React.createElement("div", { className: "form-group row" },
                                    React.createElement("div", { className: "col-xs-2" }, "\u5B9E\u6536\u6B3E"),
                                    React.createElement("div", { className: "col-xs-10" },
                                        React.createElement("input", { name: "actualPay", type: "text", className: "form-control", value: order.Sum, readOnly: true, ref: (e) => this.actualPayElement = e || this.actualPayElement }))),
                                React.createElement("div", { className: "form-group row" },
                                    React.createElement("div", { className: "col-xs-2" }, "\u6536\u6B3E\u8D26\u6237"),
                                    React.createElement("div", { className: "col-xs-10" },
                                        React.createElement("select", { name: "accountId", className: "form-control", ref: (e) => this.accountElement = e || this.accountElement },
                                            React.createElement("option", { value: "" }, "\u8BF7\u9009\u62E9\u6536\u6B3E\u8D26\u6237"),
                                            accounts.map(o => React.createElement("option", { key: o.Id, value: o.Id }, o.Name)))))),
                            React.createElement("div", { className: "modal-footer" },
                                React.createElement("button", { type: "button", className: "btn btn-default", "data-dismiss": "modal" }, "\u53D6\u6D88"),
                                React.createElement("button", { type: "button", className: "btn btn-primary", ref: (e) => e ? ui.buttonOnClick(e, () => this.receive(), { toast: "收款成功" }) : null }, "\u786E\u5B9A"))))));
            }
        }
        class OrderListPage extends React.Component {
            constructor(props) {
                super(props);
                this.state = { current_status: "" };
            }
            activeTab(status) {
                if (this.state.current_status == status)
                    return;
                if (status) {
                    this.gridView.selectArguments.filter = `Status = "${status}"`;
                }
                else {
                    this.gridView.selectArguments.filter = null;
                }
                // this.state.current_status = status;
                this.gridView.selectArguments.startRowIndex = 0;
                // this.setState(this.state);
                this.setState({ current_status: status });
                dataSource.select(this.gridView.selectArguments);
                // renderTabs(status)
            }
            exportData() {
                return __awaiter(this, void 0, void 0, function* () {
                    // const XLSX = window['XLSX'];
                    let selectResult = yield dataSource.select();
                    let arr = selectResult.dataItems; //Array.isArray(selectResult) ? selectResult :
                    let data = arr.map(o => [o.Serial, o.MemberName, o.ReceiptAddress, o.StatusText, o.Sum, o.OrderDate]);
                    data.unshift(['订单号', '付款人', '收货地址', '状态', '金额', '订单日期']);
                    const ws = XLSX.utils.aoa_to_sheet(data);
                    const wb = XLSX.utils.book_new();
                    XLSX.utils.book_append_sheet(wb, ws, "SheetJS");
                    /* generate XLSX file and send to client */
                    XLSX.writeFile(wb, "sheetjs.xlsx");
                });
            }
            showOrderDetailDialog(order) {
                this.orderDetailDialog.show(order);
            }
            showSendDialog(order) {
                return __awaiter(this, void 0, void 0, function* () {
                    let shipInfo = order.Status == 'Send' ? yield shopping.shipInfo(order.Id) : null;
                    this.orderSendDialog.show(order, shipInfo);
                });
            }
            createCommandCell(dataItem) {
                let self = this;
                let cell = new wuzhui.GridViewDataCell({
                    dataField: 'Status',
                    render(dataItem) {
                        ReactDOM.render([
                            React.createElement("button", { key: "toSend", className: dataItem.Status == 'Send' ? "btn btn-minier" : "btn btn-success btn-minier", ref: (e) => e ? e.onclick = ui.buttonOnClick(() => self.showSendDialog(dataItem)) : null },
                                React.createElement("i", { className: "icon-truck" }),
                                React.createElement("span", null, dataItem.Status == 'Send' ? '已发货' : '待发货')),
                            React.createElement("button", { key: "detail", className: "btn btn-info btn-minier", style: { marginLeft: 4 }, ref: (e) => {
                                    if (!e)
                                        return;
                                    e.onclick = (e) => self.showOrderDetailDialog(dataItem);
                                } },
                                React.createElement("i", { className: "icon-cog" }),
                                React.createElement("span", null, "\u8BE6\u7EC6"))
                        ], cell.element);
                    }
                });
                return cell;
            }
            createStatusCell(dataItem) {
                let self = this;
                let cell = new wuzhui.GridViewDataCell({
                    dataField: 'Status',
                    render(dataItem) {
                        ReactDOM.render(dataItem.Status == 'WaitingForPayment' ?
                            React.createElement("button", { className: "btn btn-purple btn-minier", onClick: () => {
                                    // self.receivablesDialog.state.order = dataItem;
                                    // self.receivablesDialog.setState(self.receivablesDialog.state);
                                    self.receivablesDialog.setState({ order: dataItem });
                                    self.receivablesDialog.show();
                                } }, shopping_1.ShoppingService.orderStatusText(dataItem.Status)) :
                            React.createElement("span", null, shopping_1.ShoppingService.orderStatusText(dataItem.Status)), cell.element);
                    }
                });
                return cell;
            }
            componentDidMount() {
                this.gridView = maishu_wuzhui_helper_1.createGridView({
                    element: this.ordersTable,
                    dataSource,
                    columns: [
                        new wuzhui.BoundField({
                            dataField: 'OrderDate', headerText: '订单日期', dataFormatString: '{G}',
                            headerStyle: { width: '100px' },
                            sortExpression: 'OrderDate'
                        }),
                        new wuzhui.BoundField({
                            dataField: 'Serial', headerText: '订单号', sortExpression: 'Serial',
                            headerStyle: { width: '120px' }
                        }),
                        new wuzhui.BoundField({
                            dataField: 'MemberName', headerText: '付款人',
                            headerStyle: { width: '100px' }
                        }),
                        new wuzhui.BoundField({
                            dataField: 'ReceiptAddress', headerText: '收货地址'
                        }),
                        new wuzhui.CustomField({
                            headerText: '状态',
                            itemStyle: { textAlign: 'center', width: '80px' },
                            createItemCell: (order) => this.createStatusCell(order)
                        }),
                        new wuzhui.BoundField({
                            dataField: 'Sum', headerText: '金额', dataFormatString: '￥{C2}',
                            itemStyle: { textAlign: 'right' }
                        }),
                        new wuzhui.CustomField({
                            createItemCell: (order) => this.createCommandCell(order),
                            headerText: '操作',
                            headerStyle: { width: '140px' },
                            itemStyle: { textAlign: 'center' },
                        })
                    ],
                    pageSize: 10
                });
            }
            render() {
                let status = this.state.current_status;
                return [
                    React.createElement("ul", { key: "tabs", id: "myTab", className: "nav nav-tabs" },
                        React.createElement("li", { className: !status ? "active" : "", onClick: () => this.activeTab('') },
                            React.createElement("a", null, "\u5168\u90E8")),
                        React.createElement("li", { className: status == 'WaitingForPayment' ? 'active' : '', onClick: () => this.activeTab('WaitingForPayment') },
                            React.createElement("a", null, "\u5F85\u4ED8\u6B3E")),
                        React.createElement("li", { className: status == 'Canceled' ? 'active' : '', onClick: () => this.activeTab('Canceled') },
                            React.createElement("a", null, "\u5DF2\u53D6\u6D88")),
                        React.createElement("li", { className: status == 'Paid' ? 'active' : '', onClick: () => this.activeTab('Paid') },
                            React.createElement("a", null, "\u5DF2\u4ED8\u6B3E")),
                        React.createElement("li", { className: status == 'Send' ? 'active' : '', onClick: () => this.activeTab('Send') },
                            React.createElement("a", null, "\u5DF2\u53D1\u8D27")),
                        React.createElement("li", { className: status == 'Received' ? 'active' : '', onClick: () => this.activeTab('Received') },
                            React.createElement("a", null, "\u5DF2\u6536\u8D27")),
                        React.createElement("li", { className: "pull-right" },
                            React.createElement("button", { onClick: () => this.exportData(), className: "btn btn-sm btn-primary", "data-toggle": "dropdown" },
                                React.createElement("i", { className: "icon-download-alt" }),
                                React.createElement("span", null, "\u5BFC\u51FA\u53D1\u8D27\u5355")),
                            React.createElement("div", { className: "form-horizontal", style: { display: 'none' }, "data-role": "export" },
                                React.createElement("div", { className: "form-group" },
                                    React.createElement("label", { className: "col-sm-3 control-label" }, "\u5F00\u59CB\u65F6\u95F4"),
                                    React.createElement("div", { className: "col-sm-9" },
                                        React.createElement("input", { "data-bind": "value: beginDate", name: "begin", className: "form-control", type: "text", placeholder: "\u586B\u5199\u8BA2\u5355\u7684\u4E0B\u5355\u65E5\u671F" }))),
                                React.createElement("div", { className: "form-group" },
                                    React.createElement("label", { className: "col-sm-3 control-label" }, "\u7ED3\u675F\u65F6\u95F4"),
                                    React.createElement("div", { className: "col-sm-9" },
                                        React.createElement("input", { "data-bind": "value: endDate", name: "end", className: "form-control", type: "text", placeholder: "\u586B\u5199\u8BA2\u5355\u7684\u4E0B\u5355\u65E5\u671F" }))),
                                React.createElement("div", { className: "form-group" },
                                    React.createElement("div", { className: "col-sm-12" },
                                        React.createElement("a", { "data-bind": "attr: { href: exportUrl }", className: "btn btn-sm btn-primary btn-block" }, "\u786E\u5B9A"))))),
                        React.createElement("li", { className: "pull-right" },
                            React.createElement("button", { "data-bind": "click: search", className: "btn btn-primary btn-sm" },
                                React.createElement("i", { className: "icon-search" }),
                                React.createElement("span", null, "\u641C\u7D22"))),
                        React.createElement("li", { className: "pull-right" },
                            React.createElement("input", { type: "text", "data-bind": "value: searchText", className: "form-control", style: { width: 300 }, placeholder: "\u8BF7\u8F93\u5165\u7CFB\u7EDF\u8BA2\u5355\u53F7\u6216\u5FAE\u4FE1\u8BA2\u5355\u53F7\u6216\u4ED8\u6B3E\u4EBA" }))),
                    React.createElement("table", { key: "orders", ref: (e) => this.ordersTable = e || this.ordersTable }),
                    React.createElement(OrderSendDialog, { key: "orderSend", ref: (e) => this.orderSendDialog = e || this.orderSendDialog }),
                    React.createElement(OrderDetailDialog, { key: "orderDetail", ref: (e) => this.orderDetailDialog = e || this.orderDetailDialog }),
                    React.createElement(ReceivablesDialog, { key: "receivablesDialog", ref: (e) => this.receivablesDialog = e || this.receivablesDialog })
                ];
            }
        }
        ReactDOM.render(React.createElement(OrderListPage, null), page.element);
    }
    exports.default = default_1;
});
